<?php
defined('_JEXEC') or die('Restricted access');
$app = JFactory::getApplication();
$input = $app->input;
$itemid = $input->get('Itemid');

$item  = $input->getArray();
$activeUsers = json_decode($item['jsonData'], 1);
$series = $activeUsers['series'];
if($series){
	$maxValue = 4;
    foreach ($series['data']  as $v) {
        $times[] = $v['time'];
        $values[] = $v['value'];
        if ($v['value'] > $maxValue)
        	$maxValue = $v['value'];
    }
    
    if ($maxValue % 4 != 0)
    	$maxValue += (4 - $maxValue % 4);
    
    $interval = $maxValue / 4;
}
$vName = $input->get('view');
?>
<div class="res-title-rg">
    <span class="fl pos-icon text-c"><i class="audience"></i></span>
    <div class="title-info">
        <h2 class="fontsize20">Session Duration</h2>
        <p><a href="#">Home</a>&nbsp;/&nbsp;Audience&nbsp;/&nbsp;Session Duration</p>
    </div>
</div>
<div class="ws-content pdall15">
<?php if ($series['data']): ?>
    <div id="main" style="height:520px;"></div>
<?php else: ?>
 	<p class="ws-tips">No report data found.</p>
<?php endif; ?>
</div>
<script type="text/javascript">
    var chart = createLineChart({
		divId: 'main',
		title: '<?php echo $series['name']?>',
    	isHourView: false,
    	xitems: <?php echo json_encode($times)?>,
    	yitems: <?php echo json_encode($values)?>,
    	xTitle: 'Time',
    	yTitle: 'Duration'		
    });
	chart.setOption({
		tooltip: {
			trigger: 'axis',
			formatter: function(params, ticket, callback) {
				return formatAsTime(params[0].value) + '<br>' + params[0].name;
			}
		},
		yAxis: {
			axisLabel: {
				formatter: function(value) {
					return formatAsTime(value);
				}
			}
		}
	});
    
</script>
